<template>
  <div class="edu-page-warp">
    <el-card shadow="never">
      <el-row type="flex" justify="space-between" class="con_title">
        <el-col :span="6">
          <div class="edu-page-title">{{$t('preDefense.applyView')}}</div>
        </el-col>
        <el-col :span="3" style="text-align: right;">
          <el-button @click="back">{{$t('message.return')}}</el-button>
        </el-col>
      </el-row>
      <el-row type="flex" justify="space-between" class="con_titles" style="margin-top: 20px;">
        <el-col :span="6">
          <div class="edu-page-title">{{$t('common.text.baseInfo')}}</div>
        </el-col>
        <el-col :span="3" style="text-align: right;">
          <el-button type="primary" @click="exportData">{{$t('message.export')}}</el-button>
        </el-col>
      </el-row>
      <baseData :label="label" :data="data" :attrs="attrs"></baseData>
    </el-card>

    <el-card shadow="never">
      <auditProgressInfo :data="auditList"></auditProgressInfo>
    </el-card>

  </div>
</template>

<script>
import { applyExportDoc, applyDetail } from "common/src/api/preDefense";
import baseData from '../common/baseData';
import auditProgressInfo from '../common/auditProgressInfo';
import {approvelDetail} from "common/src/api/approval";
import commonMixins from 'common/src/views/practiceManagement/commonMixins';
import moment from 'moment';
export default {
    components: {
      baseData,
      auditProgressInfo
    },
    mixins: [commonMixins],
    props: {
      row: {
        type: Object,
        default: {}
      },
      options: {
        type: Object,
        default: {}
      },
    },
    data() {
        return {
            data: {},
            attrs: {
              width: '110px'
            },
            label: [
                { label: this.$t('achievementApply.thesisTitle'), prop: 'thesisTitle', col: 24 },
                { label: this.$t('label.stuCode'), prop: 'stuNo' },
                { label: this.$t('label.stuName'), prop: 'stuName' },
                { label: this.$t('label.grade'), prop: 'grade' },
                { label: this.$t('achievementApply.teacherName'), prop: 'stuTutorName' },
                { label: this.$t('label.college'), prop: 'academyName' },
                { label: this.$t('label.major'), prop: 'majorName' },
                { label: this.$t('preDefense.preDefenseTime'), prop: 'defenseDate' },
                { label: this.$t('preDefense.defenseAddr'), prop: 'defenseAddr' },
                { label: this.$t('label.researchDirection'), prop: 'researchField' },
                { label: this.$t('label.trainingCategory'), prop: 'eduModeI18n' },
                { label: this.$t('label.trainingLevel'), prop: 'eduLevelI18n' },
                { label: this.$t('label.formLearning'), prop: 'studyFormI18n' },
                { label: this.$t('label.degreeCategory'), prop: 'degreeTypeI18n' },
                { label: this.$t('preDefense.researchResults'), prop: 'researchResult', col: 24 }
            ],
            auditList: [],
        };
    },
    computed: {

    },
    created() {

    },
    mounted() {
      this.getDetail();
    },
    methods: {
      back() {
          this.$emit('emit:back');
      },
      // 根据申请id查询详情
      getDetail () {
        applyDetail(this.row.applyId || this.row.id).then(res => {
          if (res.code === 200) {
            this.data = res.data;
            this.data.defenseDate = moment(this.data.defenseDate).format('YYYY-MM-DD');
            this.getApprovelDetail(res.data.workFlowId);
          }
        });
      },
      // 导出方法
      exportData () {
        let title = "预答辩申请表.doc"
        if(this.row.expertSuggestion){
          title = "预答辩结果表.doc"
        }
        applyExportDoc(this.row.id,title);
      },
      // 获取审批记录
      getApprovelDetail (workFlowId) {
        if (!workFlowId || workFlowId === '') {
          return;
        }
        let param = {
          no: workFlowId
        };
        approvelDetail(param).then(res => {
          if (res && res.data) {
            this.auditList = res.data.listApproveHistory;
          }
        });
      }
    }
};
</script>

<style scoped lang="scss">
.con {
    background-color: white;
    padding: 20px;
    &_title {
        width: 100%;
        border-bottom: solid #ccc 2px;
        padding-bottom: 20px;
    }
    &_footer {
        display: flex;
        flex-direction: row-reverse;
        border-top: solid #ccc 1px;
        padding-top: 10px;
    }
    &_apply {
        width: 900px;
    }
    &_footer {
        display: flex;
        flex-direction: row-reverse;
    }
}
</style>
